<template>
	<view class="container">
		<view class="queryForm">
			<uni-forms ref="queryRef" :model="queryParams" label-width="70px" label-align="right">
				<uni-forms-item label="参数名称">
					<uni-easyinput v-model="queryParams.configName" placeholder="请输入参数名称" />
				</uni-forms-item>
				<uni-forms-item label="参数键名">
					<uni-easyinput v-model="queryParams.configKey" placeholder="请输入参数键名" />
				</uni-forms-item>
				<uni-forms-item label="系统内置">
					<xy-select v-model="queryParams.configType" :data="sys_yes_no" placeholder="请输入系统内置" clearable />
				</uni-forms-item>
				<uni-forms-item label="操作">
					<button class="mini-btn xy-btn" type="primary" size="mini" @click="handleQuery()">搜索</button>
					<button class="mini-btn xy-btn" type="primary" size="mini" @click="resetQuery()">重置</button>
					<button class="mini-btn xy-btn" type="default" size="mini" @click="handleAdd()"
						v-if="proxy.$auth.hasPermi('system:config:add')">添加</button>
					<button class="mini-btn xy-btn" type="danger" size="mini" @click="handleRefreshCache()"
						v-if="proxy.$auth.hasPermi('system:config:remove')">刷新缓存</button>
				</uni-forms-item>
			</uni-forms>
		</view>
		<!-- @iconClick="iconClick" -->
		<view v-for="(item,index) in configList" :key="index">
			<uni-card>
				<view class="uni-body">
					<view>
						<text>参数主键：</text>
						<text>{{ item.configId }}</text>
					</view>
					<view>
						<text>参数名称：</text>
						<text>{{ item.configName }}</text>
					</view>
					<view>
						<text>参数键名：</text>
						<text>{{ item.configKey }}</text>
					</view>
					<view>
						<text>参数键值：</text>
						<text>{{ item.configValue }}</text>
					</view>
					<view>
						<text>系统内置：</text>
						<dict-tag :options="sys_yes_no" :value="item.configType" />
					</view>
					<view>
						<text>创建时间：</text>
						<text>{{ item.createTime }}</text>
					</view>
					<view>
						<text>备注：</text>
						<text>{{ item.remark }}</text>
					</view>
				</view>
				<view slot="actions" class="card-actions">
					<button class="mini-btn xy-btn" type="primary" size="mini" @click="handleUpdate(item)"
						v-if="proxy.$auth.hasPermi('system:config:edit')">编辑</button>
					<button class="mini-btn xy-btn" type="warn" size="mini" @click="handleDelete(item)"
						v-if="proxy.$auth.hasPermi('system:config:remove')">删除</button>
				</view>
			</uni-card>
		</view>
		<uni-load-more :status="xlstatus" />
	</view>
</template>

<script setup>
	import {
		listConfig,
		getConfig,
		delConfig,
		addConfig,
		updateConfig,
		refreshCache
	} from "@/pages_work/api/system/config";
	import {
		ref,
		getCurrentInstance
	} from 'vue'
	import {
		onLoad,
		onPullDownRefresh,
		onReachBottom,
	} from '@dcloudio/uni-app'
	const {
		proxy
	} = getCurrentInstance();
	const {
		sys_yes_no
	} = proxy.useDict("sys_yes_no");

	/** 查询参数列表所需的参数 */
	const queryParams = ref({
		pageNum: 1,
		pageSize: 10,
	});
	/** 总数 */
	const total = ref(0);
	/** 参数列表 */
	const configList = ref([]);
	/** 下拉状态 */
	const xlstatus = ref('more');

	/** 查询参数列表 */
	const getList = () => {
		listConfig(queryParams.value).then(res => {
			configList.value = configList.value.concat(res.rows);
			total.value = res.total;

			if (res.total == undefined) {
				// 标记加载数据完成
				xlstatus.value = 'more';
			} else if (res.total <= configList.value.length) {
				// 标记加载数据完成
				xlstatus.value = 'noMore';
			} else {
				// 标记还有剩余数据
				xlstatus.value = 'more';
			}
		})
	}

	/** 搜索按钮操作 */
	function handleQuery() {
		xlstatus.value = 'more';
		queryParams.value.pageNum = 1;
		configList.value = [];
		getList();
	};

	/** 重置按钮操作 */
	function resetQuery() {
		// dateRange.value = [];
		proxy.resetForm("queryRef");
		queryParams.value = {
			pageNum: 1,
			pageSize: 10,
		};
		handleQuery();
	};

	/** 添加参数信息 */
	const handleAdd = () => {
		uni.$once('update', function(){
			handleQuery()
		})
		proxy.$tab.navigateTo("form?title=添加参数&configId=");
	}

	/** 编辑参数信息 */
	const handleUpdate = (row) => {
		uni.$once('update', function(){
			handleQuery()
		})
		proxy.$tab.navigateTo("form?title=编辑参数&configId=" + row.configId);
	}

	/** 删除按钮操作 */
	const handleDelete = (row) => {
		const ids = row.configId;
		proxy.$modal.confirm('是否确认删除参数编号为"' + ids + '"的数据项？').then(function() {
			return delConfig(ids);
		}).then(() => {
			handleQuery();
			proxy.$modal.msgSuccess("删除成功");
		}).catch(() => {});
	};

	/** 刷新缓存按钮操作 */
	function handleRefreshCache() {
		refreshCache().then(() => {
			proxy.$modal.msgSuccess("刷新缓存成功");
		});
	}

	/** 生命周期函数--下拉刷新 */
	onPullDownRefresh(() => {
		handleQuery()
		setTimeout(function() {
			uni.stopPullDownRefresh();
		}, 1000)
	})

	/** 生命周期函数-上拉加载 */
	onReachBottom(() => {
		if (xlstatus.value == 'noMore' || xlstatus.value == 'loading') {
			// 如果没有更多数据或者正在加载数据，则不需要加载更多，直接返回
			return;
		}
		// 标记正在加载数据
		xlstatus.value = 'loading';
		queryParams.value.pageNum++;
		getList();
	})

	handleQuery();
</script>

<style lang="scss">
	@import "@/static/scss/work/index.scss";
</style>